<!-- eslint-disable vue/multi-word-component-names -->
<template>
    <div class="header">
      <!-- <div class="title" id="header-title">
        <span>数字孪生水利管理系统</span>
      </div> -->
      <!-- <div class="left-title">EDP&IMRC</div> -->
      
      <!-- <div class="right-title">
        <Date></Date>
      </div> -->
    </div>
  </template>
  
  <script setup>
  import  Date  from "@/components/ui/Date.vue";
  import { ref, reactive, onMounted } from "vue";
  </script>
  
  <style scoped lang="less">
  .header {
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 7.15vh;
    display: flex;
    background: url("@/assets/layer/header.png") no-repeat;
    // background: #000;
    background-size: 100% 100%;
    flex-direction: row;
    justify-content: space-between;
  }
  
  .left-title {
    
    font-weight: bold;
    color: #fff;
    // font-family: "ZiHunXueShiHhei";
    // background-color: #000;
    margin-left: 2.2rem;
    font-size: 2rem;
    margin-top: 1.0rem;
  }
  
  .right-title {
   
    color: #fff;
    font-size: 2rem;
  }
  
  </style>
  